<template>
  <div class="dabox">
    <div class="title">
      <img src="../assets/img/fanhui.png" alt="" @click="btnfn" />
    </div>
    <div class="header">
      <van-cell-group>
        <van-cell title="客户" value="内容" />
        <van-cell title="商品" value="内容" />
        <van-cell title="数量" type="tel" value="10000" />
        <van-cell title="下单人" value="内容" />
        <van-cell title="下单时间" value="20121212121221" />
      </van-cell-group>
    </div>

    <div class="footer">
      <!-- 输入任意文本 -->
      <van-field
        clickable
        clear-trigger
        maxlength="10"
        placeholder="张三"
        v-model="text"
        type="text"
        label="收货人"
      />
      <!-- 输入手机号，调起手机号键盘 -->
      <van-field
        v-model="tel"
        type="tel"
        maxlength="11"
        placeholder="18888888888"
        label="手机号"
      />
      <!-- 允许输入正整数，调起纯数字键盘 -->
      <van-field
        block="true"
        v-model="digit"
        rows="1"
        autosize
        type="textarea"
        maxlength="40"
        placeholder="广东省扣丁狼"
        label="收货地址"
      />
      <!-- 允许输入数字，调起带符号的纯数字键盘 -->
      <van-field
        v-model="number"
        type="number"
        placeholder="1101101101110110"
        label="物流单号"
      />
      <!-- 输入密码 -->
    </div>
    <div class="ccc"></div>
    <div class="list">
      <van-button round block type="info" native-type="submit" @click="btnfn"
        >确认发货信息</van-button
      >
    </div>
  </div>
</template>
 
<script>
// import { shipmentsApi } from "./../request/api";
export default {
  data() {
    return {
      tel: "",
      text: "",
      digit: "",
      number: "",
    };
  },
  created() {
    // shipmentsApi({}).then((res) => {
    //   console.log(res);
    // });
  },
  methods: {
    btnfn() {
      this.$router.push("/shopping");
    },
    btnfn() {
      this.$router.push("/shopping");
    },
  },
};
</script>
 
<style lang = "less" scoped>
.dabox {
  color: #000;
}
.header {
  border-bottom: 10px solid #ccc;
}
.title {
  width: 100%;
  height: 80px;
  background-color: royalblue;

  img {
    display: block;
    width: 10px;
    height: 20px;
    padding-top: 30px;
    padding-left: 20px;
  }
}
.footer {
  width: 100%;
  height: 280px;
  margin-top: 20px;
  background-color: #f5f5f5;
}
/* /deep/.van-field__control {
  background-color: #ccc;
  height: 30px;
} */

.van-field {
  height: 70px;
  span {
    color: #000;
  }
}
.ccc {
  margin-top: 20px;
  width: 100%;
  height: 50px;
  background-color: #ccc;
}
.list {
  margin-top: 10px;
  margin-left: 20px;
  margin-right: 20px;
}
</style>